<style>
li {
	list-style:disc!important;
}
li img.active {
	box-shadow:0 0 10px #fff;
}
ul {
width:<?php echo (92*count($banner))+10 ?>px;
}
</style>
<?php $today=getdate();?>
<div class="mgb40 h380 dis_blk" id="boxbannerslide">
  <div class="boxbanner <?php if(strlen($data['name'])>16) echo "w427";else echo "w350"?> pdt12 fr pdb12 pdl20 pdr20 mgt32 white">
    <h1 class="ff_museo700 mgt0 f30 mgb0"><?php echo $data['name'] ?></h1>
    <p class="mgt0 mgb5"><?php echo $data['promotion'] ?></p>
    <strong class="orange2 ff_museo700 lighter f14">from <span class="f18">$<?php echo $data['priceforbreakfast'] ?></span></strong> </div>
  <div class="boxbanner w152 pdt3 fr pdb3 pdl20 pdr20 mgt244 white"><a href="javascript:void(0);" id="amenities" class="fl ff_museo300 white f18">Policy</a> </div>
  <div class="boxbanner w152 pdt3 fr pdb3 pdl20 pdr20 mgt212 white"><a href="javascript:void(0);" id="menu" class="fl ff_museo300 white f18">Menu & Price</a> </div>
  <div class="boxbanner w152 pdt3 fr pdb3 pdl20 pdr20 mgt180 white"><a href="javascript:void(0);" id="overview" class="fl ff_museo300 white f18">Overview</a> </div>
  <div class="boxbanner w152 pdt3 fr pdb3 pdl20 pdr20 mgt276 white"><a href="javascript:void(0);" id="review" class="fl ff_museo300 white f18">Guest's review</a> </div>
  <script>
  	$('#amenities').click(function(){		
		$('html, body').animate({scrollTop:300}, 1000);
		$('#boxmenu').slideUp(1000);
		$('#imgmenu').addClass('mgt3 mgr14 tran_180deg');
		$('#boxamenity').slideDown(1000);
		$('#imgamenitiy').removeClass('mgt3 mgr14 tran_180deg');
		$('#boxoverview').slideUp(1000);
		$('#imgoverview').addClass('mgt3 mgr14 tran_180deg');
		$('#boxguest').slideUp(1000);
		$('#imgguest').addClass('mgt3 mgr14 tran_180deg');
	})
	$('#menu').click(function(){		
		$('html, body').animate({scrollTop:350}, 1000);
		$('#boxmenu').slideDown(1000);
		$('#imgmenu').removeClass('mgt3 mgr14 tran_180deg');
		$('#boxamenity').slideUp(1000);
		$('#imgamenitiy').addClass('mgt3 mgr14 tran_180deg');
		$('#boxoverview').slideUp(1000);
		$('#imgoverview').addClass('mgt3 mgr14 tran_180deg');
		$('#boxguest').slideUp(1000);
		$('#imgguest').addClass('mgt3 mgr14 tran_180deg');
	})
	$('#overview').click(function(){		
		$('html, body').animate({scrollTop:400}, 1000);
		$('#boxmenu').slideUp(1000);
		$('#imgmenu').addClass('mgt3 mgr14 tran_180deg');
		$('#boxamenity').slideUp(1000);
		$('#imgamenitiy').addClass('mgt3 mgr14 tran_180deg');
		$('#boxoverview').slideDown(1000);
		$('#imgoverview').removeClass('mgt3 mgr14 tran_180deg');
		$('#boxguest').slideUp(1000);
		$('#imgguest').addClass('mgt3 mgr14 tran_180deg');
	})
	$('#review').click(function(){		
		$('html, body').animate({scrollTop:450}, 1000);
		$('#boxmenu').slideUp(1000);
		$('#imgmenu').addClass('mgt3 mgr14 tran_180deg');
		$('#boxamenity').slideUp(1000);
		$('#imgamenitiy').addClass('mgt3 mgr14 tran_180deg');
		$('#boxoverview').slideUp(1000);
		$('#imgoverview').addClass('mgt3 mgr14 tran_180deg');
		$('#boxguest').slideDown(1000);
		$('#imgguest').removeClass('mgt3 mgr14 tran_180deg');
	})
  </script>
  <?php if(count($banner)>0){
		foreach($banner as $k=>$list){?>
  <img width="886" height="380" class="fl pst_relative" style="float:left;" id="imgbigslide<?php echo $k ?>" src="<?php echo base_url(); ?>uploads/restaurantbanner/<?php echo $list['avatar']; ?>">
  <?php }
		}?>
  <div class="item mgt-73 h62"> <a href="javascript:void(0);" id="leftclick" onclick="leftclick(<?php echo count($banner) ?>)" style="width:20px;height:100%;background:url(<?php echo base_url(); ?>public/images/Scroll%20Icon-04.png) center center no-repeat;" class="fl pst_relative mgr-20 mgt5">&nbsp;</a>
    <div class="fl w845 pst_relative ov_fl_hidden mgl20">
      <ul class="fl ov_fl_hidden pst_relative zindex11 pdt10 h62" id="boximgsmall">
        <?php if(count($banner)>0){
			foreach($banner as $k=>$list){?>
        <li style="list-style:none!important;" class="fl"> <img width="71" id="imgsmallslide<?php echo $k ?>" onclick="slidebannerhotel(<?php echo $k ?>,<?php echo count($banner) ?>);" height="55" class="fl mgl21 mgb10 <?php if($k==0) echo "active";?>" src="<?php echo base_url(); ?>uploads/restaurantbanner/<?php echo $list['avatar']; ?>"></li>
        <?php }
		}?>
      </ul>
    </div>
    <a href="javascript:void(0);" id="rightclick" onclick="rightclick(<?php echo count($banner) ?>);" style="width:20px;height:100%;background:url(<?php echo base_url(); ?>public/images/Scroll%20Icon-04.png) center center no-repeat;" class="fr pst_relative tran_180deg mgt5">&nbsp;</a> </div>
</div>
<script>
	var total=<?php echo count($banner) ?>;
	$(document).ready(function(){
		$('#boximgsmall').animate({width:92*i+'px'});
		for(var i=1;i<total;i++){
			$("#imgbigslide"+i).css({display:'none'}).animate({marginTop: '-380px',opacity:0});	
			$("#imgsmallslide"+i).addClass('opa05 cursor_poiter');
		}		
		if(total<=8){
			$('#leftclick').hide();
			$('#rightclick').hide();
		}
	});
	var oldi=0;
	var num=0;
	function slidebannerhotel(numberimg,totalimg){
		for(var i=0;i<totalimg;i++){			
			if(i==numberimg){
				$('#imgsmallslide'+numberimg).removeClass('opa05 cursor_poiter',1000).addClass('active');
				$('#imgbigslide'+numberimg).css({display:'block'}).animate({opacity:1},1000);
			}else if(i==oldi){
				$('#imgsmallslide'+oldi).removeClass('active').addClass('opa05 cursor_poiter',1000);	
				$('#imgbigslide'+oldi).animate({opacity:0},1000);
			}		
		}
		oldi=numberimg;
	}
	function rightclick(totalimg){
		if(oldi>=0 && oldi<=7){
			$('#imgsmallslide'+(oldi+1)).removeClass('opa05 cursor_poiter',1000).addClass('active');
			$('#imgbigslide'+(oldi+1)).css({display:'block'}).animate({opacity:1},1000);
			$('#imgsmallslide'+oldi).removeClass('active').addClass('opa05 cursor_poiter',1000);	
			$('#imgbigslide'+oldi).animate({opacity:0},1000);			
		}else if(oldi>=8 && oldi<=totalimg){
			$('#imgsmallslide'+(oldi+1)).removeClass('opa05 cursor_poiter',1000).addClass('active');
			$('#imgbigslide'+(oldi+1)).css({display:'block'}).animate({opacity:1},1000);
			$('#imgsmallslide'+oldi).removeClass('active').addClass('opa05 cursor_poiter',1000);	
			$('#imgbigslide'+oldi).animate({opacity:0},1000);	
			if(oldi>=totalimg-2) $('#rightclick').hide();
			$('#boximgsmall').animate({left:'-=92px'});	
			$('#leftclick').show();
		}
		oldi=oldi+1;	
	}
	function leftclick(totalimg){
		if(oldi<totalimg & oldi>totalimg-9){
			$('#imgsmallslide'+(oldi-1)).removeClass('opa05 cursor_poiter',1000).addClass('active');
			$('#imgbigslide'+(oldi-1)).css({display:'block'}).animate({opacity:1},1000);
			$('#imgsmallslide'+oldi).removeClass('active').addClass('opa05 cursor_poiter',1000);	
			$('#imgbigslide'+oldi).animate({opacity:0},1000);	
		}else if(oldi>=1 && oldi<=totalimg-9){
			$('#imgsmallslide'+(oldi-1)).removeClass('opa05 cursor_poiter',1000).addClass('active');
			$('#imgbigslide'+(oldi-1)).css({display:'block'}).animate({opacity:1},1000);
			$('#imgsmallslide'+oldi).removeClass('active').addClass('opa05 cursor_poiter',1000);	
			$('#imgbigslide'+oldi).animate({opacity:0},1000);	
			if(oldi<=1) $('#leftclick').hide();
			$('#boximgsmall').animate({left:'+=92px'});	
			$('#rightclick').show();
		}
		oldi=oldi-1;	
	}
</script>
<div class="fl w660">
  <div class="item bder_d5 pdt6 pdb9 mgb12">
    <div class="fl w136 pdl20">Date<br>
      <div class="fl w130">
        <input type="text" id="date" placeholder="<?php echo $today['year']."-".$today['mon']."-".$today['mday'] ?>" required class="bder_d5 w130 datepicker pdt5 pdb3">
      </div>
    </div>
    <div class="fl w144"> Meal<br>
      <select class="bder_d5 w130 gray pdt3 pdb3" id="meal">
        <option value="breakfast">Breakfast</option>
        <option value="lunch">Lunch</option>
        <option value="snach">Snach</option>
        <option value="dinner">Dinner</option>
      </select>
    </div>
    <div class="fl w144"> Pax<br>
      <select class="bder_d5 w130 gray pdt3 pdb3" id="pax">
        <?php for($i=0;$i<=20;$i++){if($i<10){?>
        <option value="<?php echo $i?>"><?php echo "0".$i?></option>
        <?php }else{?>
        <option value="<?php echo $i?>"><?php echo $i?></option>
        <?php }} ?>
      </select>
    </div>
    <input type="button" id="book" onclick="return check_book();" value="BOOK" class="bder0 fr ff_museo500 bgr_143167 white pdl6 pdt4 pdb4 pdr6 mgt9 mgr20">
    <script>
		$('#pax').click(function(){
			$(this).removeClass('bxshadow_ff0000');					   
		});
		$('#date').click(function(){
			$(this).removeClass('bxshadow_ff0000');					   
		});
    	function check_book(){
			if($('#pax').val()==0){
				$('#pax').addClass('bxshadow_ff0000');
				return false;
			}if($('#date').val()==null){ 
				$('#date').addClass('bxshadow_ff0000');
				return false;}
			else if($('#pax').val()!=0 && $('#date').val()!=null){
				DetailRestaurant('<?php echo $idrestaurant ?>','date','meal','pax');
			}
		}
    </script>
  </div>
  <div class="item bder_d5 f17 ff_museo700 bold txt_indent20 pdt6 pdb7 mgb5 cursor_poiter" <?php if($data['overview']!='') {?>onClick="showhidebox('imgoverview','boxoverview');"<?php }?>> Overview<img width="16" height="10" class="fr pdr14 pdt3" id="imgoverview" src="<?php echo base_url(); ?>public/images/arrowup_07.jpg"> </div>
  <?php if($data['overview']!='') echo '<div class="fl pdl40 mgb20" id="boxoverview">'.$data['overview'].'</div>'; ?>
  <div class="item bder_d5 f17 ff_museo700 bold txt_indent20 pdt6 pdb7 mgb5 cursor_poiter" <?php if($data['menu']!='') {?>onClick="showhidebox('imgmenu','boxmenu');"<?php }?>> Menu & Price<img width="16" height="10" class="fr pdr14 mgt3 mgr14 tran_180deg pdt3" id="imgmenu" src="<?php echo base_url(); ?>public/images/arrowup_07.jpg"></div>
  <?php if($data['menu']!=''){ ''; ?>
  <div class="item mgb20 an" id="boxmenu">
    <table cellpadding="0" cellspacing="0" style="border-collapse:collapse;" class="bder_d5 item mgb4 mgt15 mgb20">
      <tr class="bgr_143167 white">
        <th class="bder_d5 lheight23">Meal</th>
        <th class="bder_d5">Breakfast</th>
        <th class="bder_d5">Lunch</th>
        <th class="bder_d5">Snack</th>
        <th class="bder_d5">Dinner</th>
      </tr>
      <tr class="bgr_grdt_orange white">
        <th class="bder_d5 lheight23">Price per pax (USD)</th>
        <th class="bder_d5"><?php if($data['priceforbreakfast']!=0) echo $data['priceforbreakfast'];else echo "N/A"; ?></th>
        <th class="bder_d5"><?php if($data['priceforlunch']!=0) echo $data['priceforlunch'];else echo "N/A"; ?></th>
        <th class="bder_d5"><?php if($data['priceforsnack']!=0) echo $data['priceforsnack'];else echo "N/A"; ?></th>
        <th class="bder_d5"><?php if($data['pricefordinner']!=0) echo $data['pricefordinner'];else echo "N/A"; ?></th>
      </tr>
    </table>
    <div class="fl pdl40"> <?php echo $data['menu'] ?></div>
  </div>
  <?php }?>
  <div class="item bder_d5 f17 ff_museo700 bold txt_indent20 pdt6 pdb7 mgb5 cursor_poiter" <?php if($data['policy']!=''){?>onClick="showhidebox('imgamenitiy','boxamenity');"<?php }?>> Policy<img width="16" height="10" class="fr pdr14 mgt3 mgr14 tran_180deg pdt3" id="imgamenitiy" src="<?php echo base_url(); ?>public/images/arrowup_07.jpg"> </div>
  <?php if($data["policy"]!='') echo '<div class="pdl40 mgb20 an fl" id="boxamenity">'.$data["policy"].'</div>'; ?>
  <div class="item bder_d5 f17 ff_museo700 bold txt_indent20 pdt6 pdb7 mgb5 cursor_poiter" <?php if($data['guestreview']!=''){?>onClick="showhidebox('imgguest','boxguest');"<?php }?>> Guest's review<img width="16" height="10" class="fr pdr14 mgt3 mgr14 tran_180deg pdt3" id="imgguest" src="<?php echo base_url(); ?>public/images/arrowup_07.jpg"> </div>
  <div class="pdl40 mgb20 an fl" id="boxguest"> <?php echo $data['guestreview'] ?></div>
  <?php $this->load->view("usercontrol/suggestions");?>
</div>
<div class="fr w193">
  <div class="item bgr_gray pdt10">
    <div class="fl pdl10 w173">
      <h3 class="bgr_orange white txt_indent10 ff_museo700 f15 item pdt6 pdb5 mgt0 mgb0">Map</h3>
      <img width="100%" height="139" src="<?php echo base_url(); ?>public/images/rightbanner_03.png">
      <h3 class="bgr_orange white txt_indent10 ff_museo700 f15 item pdt6 pdb5 mgt8 mgb0">Similar Hotel</h3>
      <h3 class="blue item mgt7 mgb0 txt_indent10 f13">Standard, <span class="gray">Burmese Hotel</span></h3>
      <img width="56" height="42" class="fl pdl10 mgr5 pdt2 pdb8" src="<?php echo base_url(); ?>public/images/imgbanner2_03.jpg"><a class="blue f11" href="#">Ranked #1 of 11 Sightseeing Tours in Yangon Region</a>
      <h3 class="blue item mgt7 mgb0 txt_indent10 f13">Standard, <span class="gray">Burmese Hotel</span></h3>
      <img width="56" height="42" class="fl pdl10 mgr5 pdt2 pdb8" src="<?php echo base_url(); ?>public/images/imgbanner2_03.jpg"><a class="blue f11" href="#">Ranked #1 of 11 Sightseeing Tours in Yangon Region</a>
      <h3 class="blue item mgt7 mgb0 txt_indent10 f13">Standard, <span class="gray">Burmese Hotel</span></h3>
      <img width="56" height="42" class="fl pdl10 mgr5 pdt2 pdb8" src="<?php echo base_url(); ?>public/images/imgbanner2_03.jpg"><a class="blue f11" href="#">Ranked #1 of 11 Sightseeing Tours in Yangon Region</a> <a class="fl pdl10 blue undeline mgb10 mgt7" href="#">Need help for the booking call us</a> </div>
  </div>
  <img width="100%" class="fl mgt5" src="<?php echo base_url(); ?>public/images/rightbanner_03.png"> <img width="100%" class="fl mgt5" src="<?php echo base_url(); ?>public/images/rightbanner_03.png"> </div>
